<template>
	<!-- 新闻列表 -->
	<div class="component-item">
		<div :style="{'padding-left': item.bgMargin + 'px', 'padding-right': item.bgMargin + 'px'}"
			 style="width: 100%">
			<div class="list-wrapper" :style="{'background': item.bgColor}">
				<div class="item" :class="{'on': item.textAlign == 'left'}"
					 v-for="item2 in articleData" :key="item2.id"
					 :style="{'border-radius': item.bgStyle == 'circle' ? '10px' : '0px'}" @click="goArticle(item2.id)">
					<div class="empty-img-box">
						<img :src="item2.img" style="width: 100%;height: 78px;" v-if="item2.img != ''"/>
					</div>
					<div class="info">
						<div class="title line2">{{ item2.title }}</div>
						<div class="time">{{ item2.create_time }}</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		name: "news",
		props: {
			item: {
				type: Object,
				default() {
					return {}
				}
			}
		},
		data() {
			return {
				articleData: []
			}
		},
		mounted() {
			this.getArticleList(this.item)
		},
		methods: {
			// 文章详情
			goArticle(id) {
				uni.navigateTo({
					url: '/pages/article/detail?id=' + id
				})
			},
			// 获取文章信息
			async getArticleList(row) {
				let res = await this.$api.home.getArticleList.get({limit: row.num, cate_id: row.cate_id})
				this.articleData = res.data
			},
		}
	}
</script>

<style>
</style>